<template>
<div>
    <el-card>
        <h3 class="title">详细信息
            <el-button size="mini" icon="el-icon-back" type="info" style="position: absolute; right:0" @click="goBack">返回</el-button>
        </h3>
        <el-form label-width="140px">
            <el-row>
                <el-col :span="12">
                    <el-form-item label="合作单位名称：">
                        {{dwinfo.dwname || '-'}}
                    </el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="单位类型：">
                        {{dwinfo.registertype == 2 ? '合作方' : '担保公司' }}
                    </el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="统一社会信用代码：">
                        {{dwinfo.creditcode || '-'}}
                    </el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="选择地区权限：">
                        {{dwinfo.xzqyname || '-'}}
                    </el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="负责人：">
                        {{dwinfo.fzrname || '-' }}
                    </el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="联系电话：">
                        {{dwinfo.phone || '-'}}
                    </el-form-item>
                </el-col>
                <el-col :span="24" class="jiesuan_title">
                    <el-form-item label="结算设置："  >
                    <el-radio-group v-model="rateType" size="small">
                        <el-radio-button label="1" :disabled="!bhtIsClick">保函通</el-radio-button>
                        <el-radio-button label="2" :disabled="!hcgIsClick">惠采购</el-radio-button>
                    </el-radio-group>

                        <table class="table_area" v-show="rateType == 1" cellspacing="0" >
                            <tr>
                                <th>保函类型</th>
                                <th>保函介质</th>
                                <th>出函机构</th>
                                <th>是否场内</th>
                                <th>结算方类型</th>
                                <th>结算比例</th>
                                <th>分成比例</th>
                            </tr>
                            <tr v-for="(item,index) in filterStatus(dwrateList,1)">
                                <td style="width:10%">
                                    {{filterDiyData(bhlx,item.guaranteetype).value}}
                                </td>
                                <td style="width:10%">
                                      {{filterDiyData(bhjz,item.guaranteemedia).value}}
                                </td>
                                <td style="width:10%">
                                     {{filterDiyData(chjg,item.agencytype).value}}
                                </td>

                                <td style="width:10%">
                                    {{filterDiyData(isChangneiList,item.isChangnei).value}}
                                </td>

                                <td style="width:10%">
                                     {{filterDiyData(test,item.receType).value}}
                                </td>

                                <td style="width:10%">
                                    {{item.settRate}} %
                                </td>
                                <td style="width:10%">
                                    {{item.divideRate}} %
                                </td>
                            </tr>
                        </table>
                        <table class="table_area" v-show="rateType == 2" style="width:45%">
                            <tr>  
                                <th>地区</th>
                                <th>结算方类型</th>
                                <th>结算比例</th>
                                <th>分成比例</th>
                            </tr>
                            <tr v-for="(item,index) in filterStatus(dwrateList,2)">
                                <td style="width:25%;text-align: center;" >
                                    {{item.areaName}}
                                </td>
                                <td style="width:25%">
                                    {{filterDiyData(test,item.receType).value}}
                                </td>

                                <td style="width:25%">
                                    {{item.settRate}} %
                                </td>
                                <td style="width:25%" >
                                    {{item.divideRate}} %
                                </td>
                            </tr>
                        </table>
                    </el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="是否启用：">
                        {{dwinfo.shbj == "1" ? '是' : '否'}}
                    </el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="登录账号：">
                        {{user.loginname || '-'}}
                        <span style="color:#169BD5; padding-left:100px">默认密码：abc123</span>
                    </el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="保函推广链接：">
                        {{dwinfo.weburl || '-'}}
                    </el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="开票地址：">
                        {{dwinfo.address || '-'}}
                    </el-form-item>
                </el-col>

                <el-col :span="12">
                    <el-form-item label="营业执照：">
                    <a @click="downloadFile(dwinfo.licensefile)" style="color:#169BD5" v-if="dwinfo.licensefile">点击下载营业执照</a>
                    <span v-else>-</span>
                    </el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="合同协议：">
                        <a @click="downloadFile(dwinfo.contractfile)" style="color:#169BD5" v-if="dwinfo.contractfile">点击下载合同协议</a>
                        <span v-else>-</span>
                    </el-form-item>
                </el-col>
            </el-row>
        </el-form>
    </el-card>
    <el-card>
        <h3 class="title">收款账户信息</h3>
        <el-form label-width="140px">
            <el-row>
                <el-col :span="24">
                    <el-form-item label="开户银行名称：">
                        {{dwinfo.khbank || '-'}}
                    </el-form-item>
                </el-col>
                <el-col :span="24">
                    <el-form-item label="开户行行号：">
                        {{dwinfo.banknumber || '-'}}
                    </el-form-item>
                </el-col>
                <el-col :span="24">
                    <el-form-item label="基本账户：">
                        {{dwinfo.jbzhzh || '-'}}
                    </el-form-item>
                </el-col>
            </el-row>
        </el-form>
    </el-card>
</div>
</template>

<script>

export default {
    components: { },
    props: {},
    data(){
        return{
            form:{},
            dwinfo:{},
            dwrateList:[],
            user:{},
            bhlx:[],
            bhjz:[],
            chjg:[],
            isChangneiList:[
                {key:'0',value:'否'},
                {key:'1',value:'是'},
            ],
            test:[
                {key:'0',value:'无'},
                {key:'1',value:'平台'},
                {key:'2',value:'合作方'},
                {key:'3',value:'出函机构'},
            ],
            rateType:'',
            bhtIsClick:true,
            hcgIsClick:true,
        }
    },
    computed: {
        dwcode:function(){
            return this.getQuery('dwcode')
        }  
    },
    watch:{
        
    },
    methods: {
        getDetail:function(){
            this.$get(this.$store.getters.partnerUrl + '/partner/'+this.dwcode, {}, function(data) {
                this.rateType = data.dwrateList[0].rateType;
                this.dwinfo = data.dwinfo;
                this.dwrateList = data.dwrateList;
                if(data.user){
                    this.user = data.user;
                }

                if(this.filterStatus(data.dwrateList,1).length == 0){
                    this.bhtIsClick = false;
                }
                if(this.filterStatus(data.dwrateList,2).length == 0){
                    this.hcgIsClick = false;
                }
            })
        },
        downloadFile:function(val){
            var search = toSearch({
                fileName:val
            });
            window.open('/bhtong/common/file/download' + search)
        },
        //获取字典数据
        getZD:function(){
            new Chain().link(function (that, next) {
                that.$get(`${that.getGetters('comUrl')}/dict/bhlx`, data => {
                    that.bhlx =data;
                    next();
                    });
                }).link(function (that, next) {
                    that.$get(`${that.getGetters('comUrl')}/dict/bhjz`, data => {
                        that.bhjz =data;
                        next();
                    });
                }).link(function (that, next) {
                    that.$get(`${that.getGetters('comUrl')}/dict/chjg`, data => {
                        that.chjg =data;
                        next();
                    });
                }).run(this);
        },
        goBack:function(){
            this.$router.go(-1)
        },
        //过滤数组
        filterStatus:function(arr,val){
            let newarr =  arr.filter(function(item){
                return item.rateType == val ;
            })
            return newarr
        },
        //过滤字典数据
        filterDiyData:function(arr,val){
            let status =  arr.filter(function(item){
                return item.key == val ;
            })
            if(status != ''){
                return status[0]; //返回筛选的对象
            } else{
                return {};
            }
        },
    },
    mounted:function(){
        this.getDetail();   
        this.getZD();
    }
}
</script>

<style scoped lang="scss">
    .title{
        padding-bottom: 10px;
        border-bottom: 1px solid #e8e8e8;
        position: relative;
    }
    .jiesuan_title{
        // .el-form-item{
        //     margin-bottom: 0
        // }
    }
    .my-select{
        vertical-align: middle
    }
    .el-input{
         vertical-align: middle
    }
    ::v-deep .el-input-group__append{
        padding: 0 10px;
    }
    .table_area{
        margin-top: 10px;
        width: 80%;
        th{
            font-weight: 600;
            color: #606266;
            border-top: 1px solid #000000;
            border-right: 1px solid #000000;
        }
        border-left: 1px solid #000000;
        border-bottom: 1px solid #000000;
        border-collapse: collapse;
    }
    td{
        text-align: center;
        border-top: 1px solid #000000;
        border-right: 1px solid #000000;
    }

</style>

